# Document Object Model (объектная модель документа)
# Каждый сайт в интернете можно просмотреть не только в виде оформленной страницы с картинками,
# но и в текстовом виде HTML. Именно из этого кода мы будем извлекать необходимую информацию.
#
# Первое, что вам следует знать, — это DOM (Document Object Model) — набор правил, согласно которым формируется
# каждая веб-страница с использованием языка разметки HTML. DOM хранит структуру сайта в виде дерева и информацию,
# заключённую в тегах.
#
# Каждый элемент этого дерева называется узлом. Как вы скоро увидите на практике, узлы могут иметь неограниченную
# вложенность. Однако не рекомендуется делать эту вложенность слишком глубокой: чем больше уровней, тем сложнее
# ориентироваться в коде и тем медленнее работает страница.
#
# Вложенность тегов HTML можно сравнить с вложенностью обычных папок на вашем компьютере. Отличие заключается в том,
# что каждый узел DOM имеет своё название, атрибуты и специфическую функцию. Например, тег <title></title> указывает
# браузеру, какое название должно быть у вашей страницы на вкладке браузера, как его следует обработать и какие
# могут быть у него атрибуты.
# Пример структуры HTML страницы в файле example1.html:
#<title> задаёт название веб-страницы, отображаемое в вкладке браузера.
###########################################
# В разделе <style> прописаны CSS-правила для оформления карточки товара, но чаще всего они стили
# располагаются в отдельном файле.
###########################################
#Карточка товара оформлена в теге <div> с классом product-card и уникальным идентификатором id="product-1".
###########################################
#<h2> используется для указания названия товара, и этому тегу присвоен класс product-title.
###########################################
#<p> с классом product-description и product-price используются для отображения описания и цены товара.
###########################################
# Кнопка "Добавить в корзину" реализована с помощью тега <button>, атрибут onclick которого запускает
# JavaScript-функцию addToCart.

# Каждый тег в этом примере — это узел в DOM-дереве. Узлы могут иметь любые атрибуты (например, src="product-image.jpg"
# для тега <img>) и вложенные узлы (например, <h2> вложен в <body>).

#Дерево DOM служит нам инструментом для поиска нужного элемента на странице и взаимодействия с ним.

# При создании парсеров вам не требуется выполнять какие-то изменения в узлах DOM. Главное — понимать структуру
# DOM и знать, как получить доступ к определённому узлу и информации в нём, об этом мы будем говорить в следующих уроках.

# Исключение составляет работа с Selenium WebDriver, о которой мы тоже обязательно поговорим в следующих разделах курса.
# Будем кликать на кнопки, ожидать определённого состояния элементов и так далее. Впереди масса интересного!